<template>
	<view>
		<view class="sug_cont">
			<view class="sug_text">
				<view class="text">{{list.content}}</view>
				<view class="time">{{list.create}}</view>
			</view>
			<view class="sug_right">
				<image :src="list.imgs" mode=""></image>
				<!-- <u-icon name="arrow-right"></u-icon> -->
			</view>
		</view>
		<!-- <view class="reply_null" v-if="list.reply==null">
				暂无回复！
		</view> -->
		<view class="reply_cont" v-if="list.reply!=null">
			<!-- v-else -->		
			<view class="reply_text">
				<text class="_text">平台回复：</text>{{list.reply}}
				<!-- 使得计算机都你就是 -->
			</view>
			<view class="reply_time">
				{{list.update}}
			</view>
			<view class="reply_icon">
				<view class="_icon">
					<u-icon :name="sta?'thumb-up':'thumb-up-fill'" size="40" @click="thumbup(1)"></u-icon>
					<text class="text">已解决</text>
				</view>
				<view class="_icon">
					<u-icon :name="state?'thumb-down':'thumb-down-fill'" size="40" @click="thumbup(0)"></u-icon>
					<text class="text">未解决</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {mysuggest,suggeststatus} from '@/api/default.js'
	export default {
		data() {
			return {
				list:[],
				sta:true,
				state:true,
				stanum:1
			};
		},
		onLoad(option) {
			 const item = JSON.parse(decodeURIComponent(option.item));
			 this.list=item
			 if(item.status==1){
				 this.sta=false
			 }
		},
		methods:{
			thumbup(i){
				if(this.stanum==1){
					let data={
						id:this.list.id,
						status:i
					}
				suggeststatus({id:this.list.id,status:i}).then(res=>{
					if(res.code==200){
						this.stanum=2
						if(i==1){
							uni.showToast({
								title:'感谢您得支持！'
							})
							this.sta=false
							this.state=true
						}else{
							uni.showToast({
								title:'抱歉我们会做得更好！！！',
								icon:'none'
							})
							this.state=false
							this.sta=true
						}
					}
				})
				}
				
			}
			
			
		}
	}
</script>

<style lang="scss" scoped>
	.sug_cont{
		padding:30px 20px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom:1rpx solid #b0b9cc;
		.time{
			font-size: 12px;
			margin-top: 10px;
			color: #ababab;
		}
		.text{
			font-size: 16px;
		}
		.sug_right{
			width: 100px;
			height: 100px;
		}
	}
	.reply_null{
		margin-top: 20px;
		text-align: center;
	}
	.reply_cont{
		padding:30px 20px;
		margin-top: 40px;
		text-align: center;
		// border-bottom:1rpx solid #b0b9cc;
		.reply_text{
			text-align: left;
			font-size:16px ;
			._text{
				color: #2979ff;
			}
		}
		.reply_time{
			text-align: left;
			font-size: 12px;
			margin-top: 20px;
			color: #ababab;
		}
		.reply_icon{
			margin-top: 15px;
			display: flex;
			justify-content: space-between;
			align-items: center;
			._icon{
				width: 80px;
					
				.text{
				}
			}
			.text{
				display: block;
				font-size: 12px;
				margin-top: 5px;
			}
		}
	}
</style>
